<nav class="header-navbar navbar-expand-md navbar navbar-with-menu navbar-without-dd-arrow fixed-top navbar-semi-dark">
    <div class="navbar-wrapper">
        <div class="navbar-container content">
            <div class="collapse navbar-collapse show" id="navbar-mobile">
                <ul class="nav navbar-nav mr-auto float-left">
                    <li class="nav-item mobile-menu d-md-none mr-auto">
                        <a class="nav-link nav-menu-main menu-toggle hidden-xs" href="javascript:;"><i class="ft-menu font-large-1"></i></a>
                    </li>
                    <li class="nav-item d-none d-md-block">
                        <a class="nav-link nav-link-expand layout-screenfull" href="javascript:;" title="最大化"><i class="ficon ft-maximize"></i></a>
                    </li>
                    <li class="dropdown d-none d-md-block mr-1">
                        <a class="dropdown-toggle nav-link" id="apps-navbar-links" href="javascript:;" data-toggle="dropdown">应用</a>
                        <div class="dropdown-menu">
                            <div class="arrow_box">
                                <a class="dropdown-item" href="demo/application/email.html"><i class="ft-user"></i> 邮箱</a>
                                <a class="dropdown-item" href="demo/application/chat.html"><i class="ft-mail"></i> 聊天室</a>
                                <a class="dropdown-item" href="demo/application/project-summary.html"><i class="ft-briefcase"></i> 项目管理</a>
                                <a class="dropdown-item" href="demo/application/full-calender.html"><i class="ft-calendar"></i> 日程表</a>
                            </div>
                        </div>
                    </li>
                    <li class="nav-item dropdown navbar-search">
                        <a class="nav-link dropdown-toggle hide" data-toggle="dropdown" href="javascript:;" title="搜索"><i class="ficon ft-search"></i></a>
                        <ul class="dropdown-menu">
                            <li class="arrow_box">
                                <form>
                                    <div class="input-group search-box">
                                        <div class="position-relative has-icon-right full-width">
                                            <input class="form-control" id="search" type="text" placeholder="搜索...">
                                            <div class="form-control-position navbar-search-close"><i class="ft-x"></i></div>
                                        </div>
                                    </div>
                                </form>
                            </li>
                        </ul>
                    </li>
                </ul>
                <ul class="nav navbar-nav float-right">
                    <li class="dropdown dropdown-language nav-item">
                        <a class="dropdown-toggle nav-link" id="dropdown-language" href="javascript:;" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <i class="flag-icon flag-icon-cn"></i><span class="selected-language"></span>
                        </a>
                        <div class="dropdown-menu" aria-labelledby="dropdown-flag">
                            <div class="arrow_box">
                                <a class="dropdown-item" href="javascript:;"><i class="flag-icon flag-icon-cn"></i> 中文</a>
                                <a class="dropdown-item" href="javascript:;"><i class="flag-icon flag-icon-us"></i> 英文</a>
                            </div>
                        </div>
                    </li>
                    <li class="dropdown dropdown-notification nav-item">
                        <a class="nav-link nav-link-label" href="javascript:;" data-toggle="dropdown">
                            <i class="ficon ft-bell bell-shake" id="notification-navbar-link"></i>
                            <span class="badge badge-pill badge-sm badge-info badge-default badge-up badge-glow">5</span>
                        </a>
                        <ul class="dropdown-menu dropdown-menu-media dropdown-menu-right">
                            <div class="arrow_box_right">
                                <li class="dropdown-menu-header">
                                    <h6 class="dropdown-header m-0"><span class="grey darken-2">通知</span></h6>
                                </li>
                                <li class="scrollable-container media-list w-100">
                                    <a href="javascript:void(0)">
                                        <div class="media">
                                            <div class="media-left align-self-center"><i class="ft-plus-square icon-bg-circle bg-cyan"></i></div>
                                            <div class="media-body">
                                                <h6 class="media-heading">您有一个新的订单!</h6>
                                                <p class="notification-text font-small-3 text-muted">ECS-Linux服务器销售订单</p><small>
                                                <time class="media-meta text-muted" datetime="2015-06-11T18:29:20+08:00">30分钟前</time></small>
                                            </div>
                                        </div>
                                    </a>
                                    <a href="javascript:void(0)">
                                        <div class="media">
                                            <div class="media-left align-self-center"><i class="ft-download-cloud icon-bg-circle bg-red bg-darken-1"></i></div>
                                            <div class="media-body">
                                                <h6 class="media-heading red darken-1">阿里云文件加载99%</h6>
                                                <time class="media-meta text-muted" datetime="2015-06-11T18:29:20+08:00">5小时前</time></small>
                                            </div>
                                        </div>
                                    </a>
                                    <a href="javascript:void(0)">
                                        <div class="media">
                                            <div class="media-left align-self-center"><i class="ft-alert-triangle icon-bg-circle bg-yellow bg-darken-3"></i></div>
                                            <div class="media-body">
                                                <h6 class="media-heading yellow darken-3">警告</h6>
                                                <p class="notification-text font-small-3 text-muted">阿里云ECS服务器实例xHuyfdkehi01硬盘空间不足.</p><small>
                                                <time class="media-meta text-muted" datetime="2015-06-11T18:29:20+08:00">今天</time></small>
                                            </div>
                                        </div>
                                    </a>
                                    <a href="javascript:void(0)">
                                        <div class="media">
                                            <div class="media-left align-self-center"><i class="ft-check-circle icon-bg-circle bg-cyan"></i></div>
                                            <div class="media-body">
                                                <h6 class="media-heading">任务完成提醒</h6><small>
                                                <time class="media-meta text-muted" datetime="2015-06-11T18:29:20+08:00">上星期</time></small>
                                            </div>
                                        </div>
                                    </a>
                                    <a href="javascript:void(0)">
                                        <div class="media">
                                            <div class="media-left align-self-center"><i class="ft-file icon-bg-circle bg-teal"></i></div>
                                            <div class="media-body">
                                                <h6 class="media-heading">月工作报告提交提醒</h6><small>
                                                <time class="media-meta text-muted" datetime="2015-06-11T18:29:20+08:00">上个月</time></small>
                                            </div>
                                        </div>
                                    </a>
                                </li>
                                <li class="dropdown-menu-footer"><a class="dropdown-item text-muted text-center" href="javascript:void(0)">查看所有通知</a></li>
                            </div>
                        </ul>
                    </li>
                    <li class="dropdown dropdown-notification nav-item">
                        <a class="nav-link nav-link-label" href="javascript:;" data-toggle="dropdown"><i class="ficon ft-mail"></i></a>
                        <ul class="dropdown-menu dropdown-menu-media dropdown-menu-right">
                            <div class="arrow_box_right">
                                <li class="dropdown-menu-header">
                                    <h6 class="dropdown-header m-0"><span class="grey darken-2">消息</span></h6>
                                </li>
                                <li class="scrollable-container media-list w-100">
                                    <a href="javascript:void(0)">
                                        <div class="media">
                                            <div class="media-left">
                                                <span class="avatar avatar-sm avatar-online rounded-circle">
                                                    <img src="lucky/images/avatar/default.png" alt="avatar"><i></i>
                                                </span>
                                            </div>
                                            <div class="media-body">
                                                <h6 class="media-heading">老张</h6>
                                                <p class="notification-text font-small-3 text-muted">昨天我给你发了个红包，你收了没有？</p><small>
                                                <time class="media-meta text-muted" datetime="2015-06-11T18:29:20+08:00">刚刚</time></small>
                                            </div>
                                        </div>
                                    </a>
                                    <a href="javascript:void(0)">
                                        <div class="media">
                                            <div class="media-left">
                                                <span class="avatar avatar-sm avatar-busy rounded-circle">
                                                    <img src="lucky/images/avatar/default.png" alt="avatar"><i></i>
                                                </span>
                                            </div>
                                            <div class="media-body">
                                                <h6 class="media-heading">蒋老大</h6>
                                                <p class="notification-text font-small-3 text-muted">快来上班了！！！</p><small>
                                                <time class="media-meta text-muted" datetime="2015-06-11T18:29:20+08:00">刚刚</time></small>
                                            </div>
                                        </div>
                                    </a>
                                    <a href="javascript:void(0)">
                                        <div class="media">
                                            <div class="media-left">
                                                <span class="avatar avatar-sm avatar-online rounded-circle">
                                                    <img src="lucky/images/avatar/default.png" alt="avatar"><i></i>
                                                </span>
                                            </div>
                                            <div class="media-body">
                                                <h6 class="media-heading">古云</h6>
                                                <p class="notification-text font-small-3 text-muted">兄弟，你工作好了没？等你来上班了</p><small>
                                                <time class="media-meta text-muted" datetime="2015-06-11T18:29:20+08:00">昨天</time></small>
                                            </div>
                                        </div>
                                    </a>
                                    <a href="javascript:void(0)">
                                        <div class="media">
                                            <div class="media-left">
                                                <span class="avatar avatar-sm avatar-away rounded-circle">
                                                    <img src="lucky/images/avatar/default.png" alt="avatar"><i></i>
                                                </span>
                                            </div>
                                            <div class="media-body">
                                                <h6 class="media-heading">张峰</h6>
                                                <p class="notification-text font-small-3 text-muted">昨天把一个任务转给你了，你抽空看看！！！</p><small>
                                                <time class="media-meta text-muted" datetime="2015-06-11T18:29:20+08:00">前天</time></small>
                                            </div>
                                        </div>
                                    </a>
                                </li>
                                <li class="dropdown-menu-footer"><a class="dropdown-item text-muted text-center" href="javascript:void(0)">查看全部消息</a></li>
                            </div>
                        </ul>
                    </li>
                    <li class="dropdown dropdown-user nav-item">
                        <a class="dropdown-toggle nav-link dropdown-user-link" href="javascript:;" data-toggle="dropdown">
                            <span class="avatar avatar-online"><img src="lucky/images/avatar/default.png" alt="avatar"><i></i></span>
                        </a>
                        <div class="dropdown-menu dropdown-menu-right">
                            <div class="arrow_box_right">
                                <a class="dropdown-item" href="javascript:;">
                                    <span class="avatar avatar-online">
                                        <img src="lucky/images/avatar/default.png" alt="avatar">
                                        <span class="user-name text-bold-700 ml-1">尼山</span>
                                    </span>
                                </a>
                                <div class="dropdown-divider"></div>
                                <a class="dropdown-item menu-router" href="demo/user/profile"><i class="ft-user"></i> 个人设置</a>
                                <a class="dropdown-item menu-router" href="demo/application/email"><i class="ft-mail"></i> 我的邮箱</a>
                                <a class="dropdown-item menu-router" href="demo/application/project-summary"><i class="ft-check-square"></i> 我的任务</a>
                                <a class="dropdown-item menu-router" href="demo/application/chat"><i class="ft-message-square"></i> 聊天室</a>
                                <div class="dropdown-divider"></div>
                                <a class="dropdown-item" admin-event="logout" href="javascript:;"><i class="ft-power"></i> 退出</a>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</nav>

<div class="main-menu menu-fixed menu-accordion menu-shadow menu-dark" data-scroll-to-active="true" data-img="lucky/images/backgrounds/04.jpg">
    <div class="navbar-header">
        <ul class="nav navbar-nav flex-row position-relative">
            <li class="nav-item mr-auto">
                <a class="navbar-brand" href="/index.html">
                    <img class="brand-logo" alt="Lucky admin logo" src="lucky/images/logo/logo.png"/>
                    <h3 class="brand-text">Lucky Admin</h3>
                </a>
            </li>
            <li class="nav-item d-none d-md-block nav-toggle">
                <a class="nav-link modern-nav-toggle pr-0" data-toggle="collapse">
                    <i class="toggle-icon ft-disc font-medium-3" data-ticon="ft-disc"></i>
                </a>
            </li>
            <li class="nav-item d-md-none">
                <a class="nav-link close-navbar"><i class="ft-x"></i></a>
            </li>
        </ul>
    </div>
    <div class="main-menu-content">
        <script type="text/html" template art-url="./json/menu.json" art-done="lucky.admin.initMenuElement();" id="art-menu">
            <ul class="navigation navigation-main" id="main-menu-navigation" data-menu="menu-navigation">
                {{each data as menu index}}
                <li class="nav-item {{if menu.childrens !== undefined && menu.childrens.length > 0}}has-sub{{/if}}">
                    <a href="{{if menu.url !== undefined && menu.url !== ''}}{{ menu.url }}{{else}}javascript:;{{/if}}" {{if menu.url !== undefined && menu.url !== ''}}class="menu-router"{{/if}} >
                        {{if menu.icon !== undefined}}
                        <i class="{{ menu.icon }}"></i>
                        {{/if}}
                        <span class="menu-title">{{ menu.name }}</span>
                    </a>
                    {{if menu.childrens !== undefined && menu.childrens.length > 0}}
                    <ul class="menu-content">
                        {{each menu.childrens as secMenu secIndex}}
                        <li {{if secMenu.childrens !== undefined && secMenu.childrens.length > 0}}class="has-sub"{{/if}}>
                            <a class="menu-item {{if secMenu.url !== undefined && secMenu.url !== ''}}menu-router{{/if}}" href="{{if secMenu.url !== undefined && secMenu.url !== ''}}{{ secMenu.url }}{{else}}javascript:;{{/if}}">
                                {{if secMenu.icon !== undefined}}
                                <i class="{{ secMenu.icon }}"></i>
                                {{/if}}
                                {{ secMenu.name }}
                            </a>
                            {{if secMenu.childrens !== undefined && secMenu.childrens.length > 0}}
                            <ul class="menu-content">
                                {{each secMenu.childrens as thiMenu thiIndex}}
                                <li>
                                    <a class="menu-item {{if thiMenu.url !== undefined && thiMenu.url !== ''}}menu-router{{/if}}" href="{{if thiMenu.url !== undefined && thiMenu.url !== ''}}{{ thiMenu.url }}{{else}}javascript:;{{/if}}">
                                        {{if thiMenu.icon !== undefined}}
                                        <i class="{{ thiMenu.icon }}"></i>
                                        {{/if}}
                                        {{ thiMenu.name }}
                                    </a>
                                </li>
                                {{/each}}
                            </ul>
                            {{/if}}
                        </li>
                        {{/each}}
                    </ul>
                    {{/if}}
                </li>
                {{/each}}
            </ul>
        </script>
        <!--<ul class="navigation navigation-main" data-menu="menu-navigation">-->
            <!--<li class="nav-item">-->
                <!--<a href="/dashboard" class="menu-router">-->
                    <!--<i class="ft-home"></i>-->
                    <!--<span class="menu-title">控制台</span>-->
                    <!--<span class="badge badge badge-info badge-pill float-right mr-2">3</span>-->
                <!--</a>-->
            <!--</li>-->
            <!--<li class="nav-item has-sub">-->
                <!--<a href="javascript:;">-->
                    <!--<i class="ft-layers"></i>-->
                    <!--<span class="menu-title">应用</span>-->
                <!--</a>-->
                <!--<ul class="menu-content">-->
                    <!--<li><a class="menu-item menu-router" href="/demo/application/email">邮箱</a></li>-->
                <!--</ul>-->
            <!--</li>-->
            <!--<li class="nav-item has-sub">-->
                <!--<a href="javascript:;">-->
                    <!--<i class="ft-layout"></i>-->
                    <!--<span class="menu-title">布局</span>-->
                <!--</a>-->
                <!--<ul class="menu-content">-->
                    <!--<li><a class="menu-item menu-router" href="/demo/layout/grid">栅格</a></li>-->
                <!--</ul>-->
            <!--</li>-->
            <!--<li class="nav-item has-sub">-->
                <!--<a href="javascript:;">-->
                    <!--<i class="ft-box"></i>-->
                    <!--<span class="menu-title">组件</span>-->
                <!--</a>-->
                <!--<ul class="menu-content">-->
                    <!--<li><a class="menu-item menu-router" href="/demo/components/alerts"> 警告</a></li>-->
                    <!--<li><a class="menu-item menu-router" href="/demo/components/buttons"> 按钮</a></li>-->
                <!--</ul>-->
            <!--</li>-->
            <!--<li class="nav-item has-sub">-->
                <!--<a href="javascript:;">-->
                    <!--<i class="ft-edit"></i>-->
                    <!--<span class="menu-title">表单</span>-->
                <!--</a>-->
                <!--<ul class="menu-content">-->
                    <!--<li><a class="menu-item menu-router" href="/demo/forms/form-layout-basic"> 基本表单</a></li>-->
                <!--</ul>-->
            <!--</li>-->
            <!--<li class="nav-item has-sub">-->
                <!--<a href="javascript:;">-->
                    <!--<i class="ft-grid"></i>-->
                    <!--<span class="menu-title">表格</span>-->
                <!--</a>-->
                <!--<ul class="menu-content">-->
                    <!--<li><a class="menu-item menu-router" href="/demo/tables/table-basic"> 基本表格</a></li>-->
                <!--</ul>-->
            <!--</li>-->
        <!--</ul>-->
    </div>
    <div class="navigation-background"></div>
</div>

<div class="app-content content">
    <div class="content-wrapper">
        <div class="content-wrapper-before"></div>
        <div id="AppContent">

        </div>
    </div>
</div>